<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ include file="/common/common.jsp" %>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base target="_self">
    <title>新增费用模板</title>
    
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="新增,费用,模板">
	<meta http-equiv="description" content="This is my page">

	<style type="text/css">
	.indexDiv
	{
		width:550px;
		height:27px;
		display:inline-block;
		float:left;
		border-style:solid;
		border-width:1px;
		border-color:lightblue;
		padding: 2px 2px 2px 2px;
		margin:2px 4px 2px 2px;
	}
	</style>

  </head>
  
  <body>
    <center>
    	<s:form name="frm" id="frm" method="post" action="" namespace="">
    		<jsp:include page="/jsp/outward/business/common/menuLink.jsp">
    			<jsp:param name="menuLink" value="[{'name':'模板管理'},{'name':'费用模板'},{'name':'新增模板'}]"/>
    			<jsp:param name="width" value="40%"/>
    		</jsp:include>
    		
    		<s:hidden name="kindergartenId" id="kindergartenId"></s:hidden>
    		<s:hidden name="sort" id="sort"></s:hidden>
    		<s:hidden name="amount" id="amount"></s:hidden>
    		<s:hidden name="quantityHidd" id="quantityHidd"></s:hidden>
    		
    		<table width="90%" cellspacing="1" cellpadding="3" bgcolor="#CCCCCC">
    			<tr bgcolor="#FFFFFF">
    				<td width="15%" align="right" class="label">
    					模板名称：
    					<br>
    					<font color="red">(20字以内)</font>
    				</td>
    				<td width="85%" align="left">
    					<s:textfield name="ct.tempName" id="tempName" cssStyle="width:98%" maxlength="20"></s:textfield>
    				</td>
    			</tr>
    			<tr bgcolor="#FFFFFF">
    				<td align="right" class="label">
    					所属班级：
    				</td>
    				<td align="left">
    					<s:select name="ct.cla.id" id="classId" list="classList" cssStyle="width:120px" listKey="id" listValue="className" headerKey="" headerValue="--请选择--"></s:select>
    				</td>
    			</tr>
    			<tr bgcolor="#FFFFFF">
    				<td align="right" class="label">
    					描述：
    					<br>
    					<font color="red">(100字以内)</font>
    				</td>
    				<td align="left">
    					<s:textarea name="ct.description" id="description" cssStyle="width:98%; height:100px"></s:textarea>
    				</td>
    			</tr>
    			<tr bgcolor="#FFFFFF">
    				<td align="right" class="label">
    					指标：
    					<br>
    					<font color="red" style="font-size:12px;">(￥为每个月的费用)</font>
    				</td>
    				<td align="left">
    					<table width="100%">
    						<tr>
    							<td>
			    					<div id="actualDiv"></div>
    							</td>
    						</tr>
    						<tr>
    							<td>
				    				<a href="javascript:addActualIndex()">添加指标</a>
    							</td>
    						</tr>
    					</table>
    				</td>
    			</tr>
    		</table>
    		
    		<table width="80%" cellspacing="0">
    			<tr>
    				<td align="center" valign="bottom" height="30">
    					<input type="button" value="新增" class="btn" onclick="addChargeTemp()" />
    				</td>
    			</tr>
    		</table>
    		
    		<div id="tempDiv" style="display:none;">
    			<div class="indexDiv" id="outDiv#id#">
  					<div style="display:inline-block; float:left; width:150px;">
  						<s:hidden id="hidd#id#" name="hiddIds" value="#id#"></s:hidden>
   						<s:select name="cbIndex" id="cbIndex#id#" list="chargeIndexList" listKey="id" listValue="indexName" cssStyle="width:120px;"></s:select>
   					</div>
   					<div style="display:inline-block; float:left; width:100px;">
  						数量
  						<s:textfield id="quantity#id#" cssStyle="width:40px;" value="1" onblur="quantityCheck('#id#')" maxlength="2"></s:textfield>
  					</div>
  					<div style="display:inline-block; float:left; width:150px;">
  						单价(￥)
  						<s:textfield id="amountTxt#id#" cssStyle="width:60px;" onblur="doubleCheck('#id#')"></s:textfield>
  					</div>
  					<div style="display:inline-block; float:left; width:80px">
  						排序&nbsp;<s:textfield id="sortTxt#id#" cssStyle="width:40px;" onblur="intCheck('#id#')"></s:textfield>
  					</div>
  					<div style="display:inline-block; float:right; width:40px; line-height:25px;">
  						<a href="javascript:delActualIndex('#id#')">删除</a>
  					</div>
  				</div>
    		</div>
    		
    	</s:form>
    </center>
    
    <script type="text/javascript">
    var n = 0;
    function addChargeTemp()
    {
    	var tempName = $('#tempName');
    	var description = $('#description');
    	var cbIndex = $('select[name="cbIndex"]');
    	var hiddIds = $('input:hidden[name="hiddIds"]');
    	if(!isNotNull(tempName.val()))
    	{
    		showMsg('模板名称不能为空。', function(){tempName.focus();});
    		return;
    	}
    	if(!isNotNull(description.val()))
    	{
    		showMsg('描述不能为空。', function(){description.focus();});
    		return;
    	}
    	if(description.val().length > 100)
    	{
    		showMsg('描述不能超过100字。', function(){description.focus();});
    		return;
    	}
    	var len = cbIndex.length;
    	var sortArray = new Array();
    	var amountArray = new Array();
    	var quantityArray = new Array();
    	var actualLen = len - 1;
    	for(var i = 0; i < actualLen; i++)
    	{
    		var cbx = $(cbIndex.get(i));
    		var hiddx = $(hiddIds.get(i));
    		var sortValue = $('#sortTxt' + hiddx.val()).val();
    		var amountValue = $('#amountTxt' + hiddx.val()).val();
    		var quantityValue = $('#quantity' + hiddx.val()).val();
    		if(!isNotNull(amountValue))
    		{
    			showMsg('金额不能为空。', function(){$('#amountTxt' + hiddx.val()).focus();});
    			return;
    		}
    		if(!isNotNull(sortValue))
    		{
    			showMsg('排序不能为空。', function(){$('#sortTxt' + hiddx.val()).focus();});
    			return;
    		}
    		if(!isNotNull(quantityValue))
    		{
    			showMsg('数量不能为空。', function(){$('#quantity' + hiddx.val()).focus();});
    			return;
    		}
    		sortArray.push(sortValue);
    		amountArray.push(amountValue);
    		quantityArray.push(quantityValue);
    	}
   		$('#sort').val(sortArray);
   		$('#amount').val(amountArray);
   		$('#quantityHidd').val(quantityArray);
    	
    	var url = 'inner/charge/addChargeTemp.action';
    	ajaxAction(url, 'post', 'frm', false, function(){
   			var kgId = getTopKg();
    		var back = realPath + '/inner/charge/chargeTempManage.action?kindergartenId=' + kgId;
    		window.location.href = back;
    	});
    }
    
    function intCheck(sortTxtId)
    {
    	var sortTxtx = $('#sortTxt' + sortTxtId);
    	if(isNotNull(sortTxtx.val()) && checkInteger(sortTxtx) == false)
    	{
    		showMsg('排序有误。', function(){sortTxtx.focus();});
    		sortTxtx.val('');
    	}
    	else if(parseInt(sortTxtx.val(), 10) > 999)
    	{
    		showMsg('排序不能大于999。', function(){sortTxtx.focus();});
    		sortTxtx.val('');
    	}
    }

    function doubleCheck(amountTxtId)
    {
    	var amountTxtx = $('#amountTxt' + amountTxtId);
    	if(isNotNull(amountTxtx.val()) && checkFloat(amountTxtx) == false)
    	{
    		showMsg('金额有误。', function(){amountTxtx.focus();});
    		amountTxtx.val('');
    	}
    	else if(parseFloat(amountTxtx.val(), 10) < 0)
    	{
    		showMsg('金额不能小于0。', function(){amountTxtx.focus();});
    		sortTxtx.val('');
    	}
    }
    
    function quantityCheck(id)
    {
    	var quantityx = $('#quantity' + id);
    	if(!checkInteger(quantityx))
    	{
    		showMsg('数量只能为整数', function(){quantityx.focus();});
    		quantityx.val('');
    	}
    }
    
    function addActualIndex()
    {
        var tempDiv = $('#tempDiv');
        var actualDiv = $('#actualDiv');
        var html = tempDiv.html();
        html = html.replaceAll('#id#', n+'');
        actualDiv.html(actualDiv.html() + html);
        n++;
    }

    function delActualIndex(id)
    {
        var outDivx = $('#outDiv' + id);
        outDivx.remove();
    }
    </script>
  </body>
</html>
